<template>
  <div>
		<hr class="two" />
		<h2>==== ScopedStyle 限制样式的作用范围） ===</h2>
    <hr class="two" />
    <h2> scoped :作用：让样式在局部生效，防止冲突。</h2>
    <h1 class="title">你好啊</h1>
    <School />
    <Student />
  </div>
</template>

<script>
import Student from './Student'
import School from './School' // 样式 style 后来者居上

export default {
  name: 'ScopedStyle',
  components: {School, Student}
}
</script>

<style scoped>
/*
scoped 限制作用域： 后拼接随机生成的数字 达到去重
*/


.title {
  color: red;
}
</style>
